<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>客服中心-在线留言</title>
  <!-- 链入css初始化 -->
  <link rel="stylesheet" href="../../css/base.css">
  <!-- 链入头部和底部通用样式 -->
  <link rel="stylesheet" href="../../css/reset.css">
  <link rel="stylesheet" href="../../css/common.css">
  <!-- <link rel="stylesheet" href="../../common/common.css"> -->
  <link rel="stylesheet" href="../../css/main.css">
  <!-- 链入首页主体样式 -->
  <link rel="stylesheet" href="../../css/index.css">
  <!-- 公共样式 -->
  <link rel="stylesheet" type="text/css" href="../../css/animate.css">
  <link rel="stylesheet" type="text/css" href="../../css/customer/contactUs.css">
  <!--[if lt IE 9]>

<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>

<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>

<![endif]-->
</head>
<script>
    function saveRro() {
        // $("#form").ajaxSubmit(function (message) {
        //   // 对表单进行提交后进行的操作，相当于ajax提交表单的success
        // });
        debugger
        return false; // 返回false，阻止跳转
      }
</script>
<body>
  <header></header>
 <iframe name="stop" style="display: none;"></iframe>
  <div class="productList-container">
    <div class="common-container-img">
      <img class="bannerPc" src="../../img/customer/banner.jpg" alt="">
      <img class="bannerMb" src="../../img/customer/banner.jpg" alt="">
      <ul class="common-container-type clearfix wow fadeInUpBig">
        <li onclick="window.open('center.html')"><img class="hides" src="../../img/select.jpg" alt=""><img class="icon"
            src="../../img/customer/icon1.png" alt=""><span>联系我们</span></li>
        <li class="active" onclick="window.open('contactus.html')"><img class="hides" src="../../img/select.jpg"
            alt=""><img class="icon" src="../../img/customer/icon2-1.png" alt=""><span>在线留言</span></li>
      </ul>
    </div>
    <h6 class="bannerMb Mbtitle wow fadeInUpBig">快递信息提交 </h6>
    <div id="innovationList1">
      <div class="formBox wow fadeInUpBig">
        <h6 class="bannerPc Pctitle">快递信息提交 </h6>
        <form action="demo_form.php" method="get"  id="form" οnsubmit="return saveRro()" target="stop">
          <div class="clearfix input marginTop"><input type="text" class="pull-left col-lg-8 col-xs-12 col-sm-12"
              placeholder="留言标题"><input type="text" class="pull-right col-lg-3 col-xs-12 col-sm-12 mbMR"
              placeholder="联系方式"></div>
          <div class="message marginTop"><textarea name="留言内容" cols="40" rows="6" class="textarea"
              placeholder="留言内容"></textarea></div>
          <div class="clearfix verify marginTop">
            <div class="col-lg-5 col-xs-4 pull-left"><input class='verify-input' type="text" placeholder="验证码"></div>
            <div class="pull-left code col-xs-8 col-md-5 col-lg-5"><span class="verify-img"><img
                  src="../../img/customer/wird.png" alt=""></span><span class="changeVerify">看不清，换一张</span>
            </div>
          </div>
          <input type="submit" class="btn marginTop" style="padding: 0;height: 50px;">
        </form>
        <div class="tips">我们在收到信息后，将会尽快与您联系！ </div>
      </div>

    </div>

  </div>
  <footer></footer>

  <script src="../../js/jquery-1.11.3.min.js"></script>
  <script src="https://cdn.bootcdn.net/ajax/libs/wow/1.1.2/wow.min.js"></script>
  <script src="../../js/common.js"></script>
  <script type="text/javascript">
    $(function () {
      $('header').load('../../template/header.html')
      $('footer').load('../../template/footer.html')

    
      var imgArr = ['../../img/production/banner_05.jpg', '../../img/production/banner_05.jpg', '../../img/production/banner_05.jpg', '../../img/production/banner_05.jpg', '../../img/production/banner_05.jpg']
      var listEle = []
      var url
      $('.selected').css({ 'background': 'url(../../img/select.jpg) no-repeat 100% 100%', 'color': '#fff', 'background-size': 'cover' }).find('span').css({ 'color': '#fff' })
      // $('.productList-container-type li').click(function () {
      //   var setTitle = $(this).find('span').html().split('类')[0]
      //   setDomEle(setTitle)
      //   $(this).css({ 'background': 'url(../../img/production/select.png) no-repeat 100% 100%', 'color': '#fff' }).siblings().css({ 'background': '#fff', 'color': '#000' })
      // })

      function setDomEle(setTitle) {
        listEle = []
        var setTitle = setTitle || '十三香'
        $('.titles').html(setTitle)
        $('.productText').html(setTitle + ' - 本品精选多种植物香辛料，经传统工艺炮制，现代技术精制而成')
        $('ul.list li').remove()
        // 兼容ie8
        for (var index = 0, len = imgArr.length; index < len; index++) {
          var item = imgArr[index]
          listEle.push('<a href="#' + url + '" target="_blank">'
            + '<li class="pull-left col-xs-3"><img src=' + item + ' alt=""></li>'
            + '</a>')
        }
        // imgArr.forEach(function (item, index) {
        //   listEle.push('<a href="#' + url + '" target="_blank">'
        //     + '<li class="pull-left col-xs-3"><img src=' + item + ' alt=""></li>'
        //     + '</a>')
        // })
        console.log(listEle.join(''))
        $('ul.list').append(listEle.join(''))
      }
      setDomEle()

      if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {
        new WOW().init();
      };
    })



  </script>
</body>

</html>